<template>
	<view>
		<camera device-position="front" flash="off" class="camera" @error="error" v-if="showCamera"></camera>
		<image :src="photoPath" mode="widthFix" class="image" v-if="showImage"></image>
		<view class="operate-container">
			<button type="primary" class="btn" @tap="clickBtn" :disabled="!canChecking">{{btnText}}</button>
			<button type="warn" class="btn" @tap="afresh" :disabled="!canChecking">重拍</button>
		</view>
		<view class="notice-container">
			<text class="notice">注意事项</text>
			<text class="desc">拍照签到的时候，必须要拍摄自己的正面照片，
			侧面照片会导致无法识别。另外，拍照的时候不要戴墨镜或者帽子，避免影响拍照签到的准确度。</text>
		</view>
	</view>
</template>

<script>
	var QQmap = require('../../lib/qqmap-wx-jssdk.min.js')
	var qqmapsdk;
	export default {
		data() {
			return {
				canChecking:true,
				photoPath:'',
				btnText:'拍照',
				showCamera:true,
				showImage:false
			}
		},
		onLoad:function() {
			qqmapsdk=new QQmap({
				key:'OEVBZ-36JK4-S4CUB-D5VPM-3JPYE-IBFO3'
			})
		},
		onShow:function(){
			let that=this
			that.ajax(that.url.validCanCheckIn,"GET",null,function(resp){
				let msg=resp.data.msg
				if(msg!="可以考勤"){
					that.canChecking=false
					setTimeout(function(){
						uni.showToast({
							title:msg,
							icon:'none'
						})
					})
				}
			})
		},
		methods: {
			clickBtn:function(){
				let that=this;
				if(that.btnText=='拍照'){
					let ctx=uni.createCameraContext();
					ctx.takePhoto({
						quality:"high",
						success:function(resp) {
							console.log(resp.tempImagePath);
							that.photoPath=resp.tempImagePath;
							that.showCamera=false;
							that.showImage=true;
							that.btnText="签到"
						}
					})
				}else{
					uni.showLoading({
						title:'请稍后片刻'
					})
					setTimeout(function(){
						uni.hideLoading()
					},1000)
					uni.getLocation({
					    type: 'wgs84',
					    success: (res)=>{
					        // console.log('当前位置的经度：' + res.longitude);
					        // console.log('当前位置的纬度：' + res.latitude);
							let longitude=res.longitude
							let latitude=res.latitude
							qqmapsdk.reverseGeocoder({
								location:{
									longitude:longitude, 
									latitude:latitude
								},
								success:function(res){
									console.log("res:",res.result);
									let address=res.result.address;
									let component=res.result.address_component;
									let nation = component.nation;
									let province=component.province;
									let city=component.city;
									let district=component.district;
									// console.log("国家：",nation,",省份：",province,",城市：",city,",区域：",district);
									uni.uploadFile({
										url:that.url.checkin,
										filePath: that.photoPath,
										name:"photo",
										header:{
											token:uni.getStorageSync("token")
										},
										formData:{
											address:address,
											province:province,
											country:nation,
											city:city,
											district:district
										},
										success:function(resp){
											console.log("r1",resp);
											if(resp.statusCode==500&&resp.data=="不存在人脸模型"){
												uni.hideLoading()
												uni.showModal({
													title:"提示信息",
													content:"系统不存在人脸模型，请确认是否使用当前照片作为模型？",
													success:function(res){
														if(res.confirm){
															uni.uploadFile({
																url:that.url.createFaceModel,
																filePath: that.photoPath,
																name:"photo",
																header:{
																	token:uni.getStorageSync("token")
																},
																success:function(resp){
																	if(resp.statusCode==500){
																		uni.showToast({
																			title:resp.data,
																			icon:'none'
																		})
																	}else if(resp.statusCode==200){
																		uni.showToast({
																			title:'人脸建模成功',
																			icon:'none'
																		})
																	}
																}
														})
													}
													}
												})
											}else if(resp.statusCode==200){
												console.log("r2",resp);
												let data=JSON.parse(resp.data)
												let code=data.code
												let msg=data.msg
												console.log("code",code,"msg",msg);
												if(code==200){
													uni.hideLoading()
													uni.showToast({
														title:'签到成功',
														complete:function(){
															uni.navigateTo({
																url:"../checkin_result/checkin_result"
															})
														}
													})
												}
											} else if(resp.statusCode==500){
												uni.showToast({
													title:resp.data,
													icon:'none'
												})
											}
										},				
									})
								}
							})
						},
					});
				}
			},
			afresh:function(){
				let that=this;
				that.showCamera=true;
				that.showImage=false;
				that.btnText="拍照"
			}
		}
	}
</script>

<style lang="less">
	@import url("checkin.less");
</style>
